/* packageA/pages/org-detail/index.wxss */

page {
  background-color: #f0f4f9;
}
.custom-image {
  width: 100%;
  .van-empty__image {
    width: 400rpx !important;
    height: 190rpx !important;
  }
}
.service-container {
  // 轮播图
  .swiper-container {
    height: 410rpx;
    margin: 20rpx 30rpx;
    background-color: #fff;
    border-radius: 15rpx;
    overflow: hidden;
    .swiper-item-box {
      width: 100%;
      text-align: center;
    }
    .itemImage {
      width: 100%;
    }
  }
 
  // 价格
  .price-box {
    background-color: #fff;
    margin: 0 30rpx 20rpx 30rpx;
    padding-bottom: 25rpx;
    padding-top: 25rpx;
    border-radius: 15rpx 15rpx 15rpx 15rpx;
    .price-title-box {
      margin: 0rpx 21rpx 9rpx 21rpx;
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      .price-text {
        display: flex;
        align-items: flex-end;
        font-weight: bold;
        height: 50rpx;
        color: #ff0c0c;
        .text-large {
          font-size: 48rpx;
          height: 65rpx;
        }
        .text-small {
          font-size: 26rpx;
        }
      }
      .have-sold {
        font-weight: 400;
        font-size: 24rpx;
        color: #666666;
      }
    }
    .service-name-box {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      margin: 0 20rpx;
      .service-name {
        font-weight: bold;
        font-size: 30rpx;
        color: #000000;
        // margin: 0 0rpx 0 30rpx;
        margin-right: 10rpx;
        overflow: hidden; /*超出的部分隐藏起来。*/
        white-space: nowrap; /*不显示的地方用省略号...代替*/
        text-overflow: ellipsis; /* 支持 IE */
      }
      .org-tips1 {
        display: flex;
        justify-content: center;
        font-weight: 400;
        font-size: 24rpx;
        padding: 2rpx 10rpx;
        border-radius: 5rpx 5rpx 5rpx 5rpx;
        margin: 0 6rpx;
        text-align: center;
      }
    }

    .org-info-box {
      display: flex;
      margin: 18rpx 0;
      .org-item {
        width: 25%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column-reverse;
        flex-wrap: wrap;
        height: 110rpx;
        margin: 0 10rpx;
        background: rgba(250, 171, 64, 0.15);
        border-radius: 5rpx 5rpx 5rpx 5rpx;
        font-weight: 500;
        font-size: 28rpx;
        color: #faab40;
        text-align: center;
        &:first-child {
          margin-left: 20rpx;
        }
        &:last-child {
          margin-right: 20rpx;
        }
        .text {
          width: 100%;
        }
        .type {
          width: 100%;
        }
      }
    }
    .chart-box {
      margin: 0 20rpx 20rpx 20rpx;
      padding-bottom: 20rpx;
      padding-top: 20rpx;
      border-bottom: 1rpx solid #f6f6f6;
      font-weight: 500;
      font-size: 30rpx;
      color: #000000;
    }
    .obj-box {
      margin: 0 20rpx 20rpx 20rpx;
      padding-bottom: 20rpx;
      border-bottom: 1rpx solid #f6f6f6;
      font-weight: 500;
      font-size: 30rpx;
      color: #000000;
    }
    .org-info-content {
      margin: 0 20rpx 20rpx 20rpx;
      .title {
        font-weight: 500;
        font-size: 30rpx;
        color: #000000;
        margin-bottom: 10rpx;
      }
      .content {
        font-weight: 400;
        font-size: 24rpx;
        color: #000000;
        text-indent: 2em;
      }
    }
    .service-description {
      background-color: #fff;
      font-weight: 400;
      font-size: 24rpx;
      color: #666666;
      margin: 7rpx 21rpx 0rpx 21rpx;
    }
  }

  // 机构卡片
  .com-box {
    background-color: #fff;
    border-radius: 15rpx 15rpx 15rpx 15rpx;
    margin: 0 30rpx;
    padding: 20rpx 29rpx;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    .top-box {
      width: 100%;
      font-weight: 500;
      font-size: 30rpx;
      color: #000000;
      border-bottom: 1rpx solid #f6f6f6;
      padding-bottom: 20rpx;
    }
    .bottom-tel {
      width: 100%;
      margin-top: 5rpx;
      font-weight: 500;
      font-size: 30rpx;
      color: #000000;
      padding: 20rpx 0;
    }
  }

  // 服务说明
  .service-description-box {
    margin: 20rpx 30rpx;
    background-color: #fff;
    border-radius: 15rpx;
    padding: 20rpx 27rpx;
    .dec-title {
      font-weight: 500;
      font-size: 30rpx;
      color: #000000;
      padding-bottom: 20rpx;
      border-bottom: 2rpx solid #f6f6f6;
    }
    .dec-box {
      margin-top: 20rpx;
      // margin-bottom: 10rpx;
      .swiper-container2 {
        height: 410rpx;
        // margin: 20rpx 30rpx;
        background-color: #fff;
        border-radius: 15rpx;
        overflow: hidden;
        .swiper-item-box {
          width: 100%;
          text-align: center;
        }
        .itemImage {
          width: 100%;
        }
      }
    }
  }

  // 服务评价
  .service-evaluate {
    margin: 20rpx 30rpx;
    background-color: #fff;
    border-radius: 15rpx;
    padding: 20rpx 27rpx;
    .service-title-box {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-weight: 500;
      padding-bottom: 20rpx;
      border-bottom: 2rpx solid #f6f6f6;
      .title-text {
        color: #000000;
        font-size: 30rpx;
      }
      .service-all {
        font-size: 24rpx;
        color: #faab41;
      }
    }
    .service-evaluate-content {
      .evaluate-user {
        margin: 20rpx 0;
        display: flex;
        align-items: center;
        .left-img {
          background-color: #f0f4f9;
          width: 110rpx;
          height: 110rpx;
          border-radius: 17rpx;
        }
        .evaluate-user-right {
          flex: 1;
          margin-left: 20rpx;
          .service-title {
            font-weight: 500;
            font-size: 30rpx;
            color: #000000;
          }
          .evaluate-star-box {
            display: flex;
            align-items: center;
            justify-content: space-between;
            .star-text {
              font-weight: 400;
              font-size: 24rpx;
              color: #999999;
            }
            .star-time {
              font-weight: 400;
              font-size: 24rpx;
              color: #999999;
            }
          }
        }
      }
      .evaluate-text {
        font-weight: 400;
        font-size: 24rpx;
        color: #000000;
        margin: 20rpx 0;
      }
      .evaluate-images {
        width: 100%;
        .item-box {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          width: 33%;
          image {
            width: 100%;
            // height: 60rpx;
            // width: 65rpx;
            // height: 65rpx;
          }
        }
      }
    }
  }

  .fixed-box {
    height: 140rpx;
  }

  .order-box {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    height: 140rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .order-left {
      margin-left: 30rpx;
      display: flex;
      align-items: center;
      .left-text {
        font-weight: 400;
        font-size: 30rpx;
        color: #000000;
      }
      .collect-icon {
        margin-right: 10rpx;
        display: inline-block;
        transition: 500ms;
        opacity: 1;
      }
      .active-click {
        transform: scale(1.5);
        opacity: 0.2;
      }
    }
    .order-right {
      padding-right: 30rpx;
      .van-button--small {
        padding: 30rpx 45rpx !important;
      }
    }
  }
}
